<nav class="navbar navbar-dark navbar-expand-md jh-navbar">
    <div class="jh-logo-container float-left">
        <a class="jh-navbar-toggler d-lg-none float-right" href="javascript:void(0);" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation" (click)="toggleNavbar()">
            <fa-icon [icon]="'bars'"></fa-icon>
        </a>
        <a class="navbar-brand logo float-left" routerLink="/" (click)="collapseNavbar()">
            <span class="logo-img"></span>
            <span jhiTranslate="global.title" class="navbar-title">Invoiceproject</span> <span class="navbar-version">{{version}}</span>
        </a>
    </div>
    <div class="navbar-collapse collapse" id="navbarResponsive" [ngbCollapse]="isNavbarCollapsed" [ngSwitch]="isAuthenticated()">
        <ul class="navbar-nav ml-auto">
            <li class="nav-item" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}">
                <a class="nav-link" routerLink="/" (click)="collapseNavbar()">
                    <span>
                        <fa-icon [icon]="'home'"></fa-icon>
                        <span jhiTranslate="global.menu.home">Home</span>
                    </span>
                </a>
            </li>
            <!-- jhipster-needle-add-element-to-menu - JHipster will add new menu items here -->
            <li *ngSwitchCase="true" ngbDropdown class="nav-item dropdown pointer" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}">
                <a class="nav-link dropdown-toggle" ngbDropdownToggle href="javascript:void(0);" id="entity-menu">
                    <span>
                        <fa-icon [icon]="'th-list'"></fa-icon>
                        <span jhiTranslate="global.menu.entities.main">
                            Entities
                        </span>
                    </span>
                </a>
                <ul class="dropdown-menu" ngbDropdownMenu>
                    <li>
                        <a class="dropdown-item" routerLink="application" routerLinkActive="active" [routerLinkActiveOptions]="{ exact: true }" (click)="collapseNavbar()">
                            <fa-icon [icon]="'asterisk'" [fixedWidth]="true"></fa-icon>
                            <span jhiTranslate="global.menu.entities.application">Application</span>
                        </a>
                    </li>
                    <li>
                        <a class="dropdown-item" routerLink="access-token" routerLinkActive="active" [routerLinkActiveOptions]="{ exact: true }" (click)="collapseNavbar()">
                            <fa-icon [icon]="'asterisk'" [fixedWidth]="true"></fa-icon>
                            <span jhiTranslate="global.menu.entities.accessToken">Access Token</span>
                        </a>
                    </li>
                    <li>
                        <a class="dropdown-item" routerLink="invoice-info" routerLinkActive="active" [routerLinkActiveOptions]="{ exact: true }" (click)="collapseNavbar()">
                            <fa-icon [icon]="'asterisk'" [fixedWidth]="true"></fa-icon>
                            <span jhiTranslate="global.menu.entities.invoiceInfo">Invoice Info</span>
                        </a>
                    </li>
                    <li>
                        <a class="dropdown-item" routerLink="e-invoice-info" routerLinkActive="active" [routerLinkActiveOptions]="{ exact: true }" (click)="collapseNavbar()">
                            <fa-icon [icon]="'asterisk'" [fixedWidth]="true"></fa-icon>
                            <span jhiTranslate="global.menu.entities.eInvoiceInfo">E Invoice Info</span>
                        </a>
                    </li>
                    <li>
                        <a class="dropdown-item" routerLink="invoice-report" routerLinkActive="active" [routerLinkActiveOptions]="{ exact: true }" (click)="collapseNavbar()">
                            <fa-icon [icon]="'asterisk'" [fixedWidth]="true"></fa-icon>
                            <span jhiTranslate="global.menu.entities.invoiceReport">Invoice Report</span>
                        </a>
                    </li>
                    <!-- jhipster-needle-add-entity-to-menu - JHipster will add entities to the menu here -->
                </ul>
            </li>
            <li *jhiHasAnyAuthority="'ROLE_ADMIN'" ngbDropdown class="nav-item dropdown pointer" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}">
                <a class="nav-link dropdown-toggle" ngbDropdownToggle href="javascript:void(0);" id="admin-menu">
                    <span>
                        <fa-icon [icon]="'user-plus'"></fa-icon>
                        <span jhiTranslate="global.menu.admin.main">Administration</span>
                    </span>
                </a>
                <ul class="dropdown-menu" ngbDropdownMenu>
                    <li>
                        <a class="dropdown-item" routerLink="admin/user-management" routerLinkActive="active" (click)="collapseNavbar()">
                            <fa-icon [icon]="'user'" [fixedWidth]="true"></fa-icon>
                            <span jhiTranslate="global.menu.admin.userManagement">User management</span>
                        </a>
                    </li>
                    <li>
                        <a class="dropdown-item" routerLink="admin/jhi-metrics" routerLinkActive="active" (click)="collapseNavbar()">
                            <fa-icon [icon]="'tachometer-alt'" [fixedWidth]="true"></fa-icon>
                            <span jhiTranslate="global.menu.admin.metrics">Metrics</span>
                        </a>
                    </li>
                    <li>
                        <a class="dropdown-item" routerLink="admin/jhi-health" routerLinkActive="active" (click)="collapseNavbar()">
                            <fa-icon [icon]="'heart'" [fixedWidth]="true"></fa-icon>
                            <span jhiTranslate="global.menu.admin.health">Health</span>
                        </a>
                    </li>
                    <li>
                        <a class="dropdown-item" routerLink="admin/jhi-configuration" routerLinkActive="active" (click)="collapseNavbar()">
                            <fa-icon [icon]="'list'" [fixedWidth]="true"></fa-icon>
                            <span jhiTranslate="global.menu.admin.configuration">Configuration</span>
                        </a>
                    </li>
                    <li>
                        <a class="dropdown-item" routerLink="admin/audits" routerLinkActive="active" (click)="collapseNavbar()">
                            <fa-icon [icon]="'bell'" [fixedWidth]="true"></fa-icon>
                            <span jhiTranslate="global.menu.admin.audits">Audits</span>
                        </a>
                    </li>
                    <li>
                        <a class="dropdown-item" routerLink="admin/logs" routerLinkActive="active" (click)="collapseNavbar()">
                            <fa-icon [icon]="'tasks'" [fixedWidth]="true"></fa-icon>
                            <span jhiTranslate="global.menu.admin.logs">Logs</span>
                        </a>
                    </li>
                    <li *ngIf="swaggerEnabled">
                        <a class="dropdown-item" routerLink="admin/docs" routerLinkActive="active" (click)="collapseNavbar()">
                            <fa-icon [icon]="'book'" [fixedWidth]="true"></fa-icon>
                            <span jhiTranslate="global.menu.admin.apidocs">API</span>
                        </a>
                    </li>
                    <!-- jhipster-needle-add-element-to-admin-menu - JHipster will add entities to the admin menu here -->
                </ul>
            </li>
            <li ngbDropdown class="nav-item dropdown pointer" *ngIf="languages && languages.length > 1">
                <a class="nav-link dropdown-toggle" ngbDropdownToggle href="javascript:void(0);" id="languagesnavBarDropdown">
                    <span>
                        <fa-icon [icon]="'flag'"></fa-icon>
                        <span jhiTranslate="global.menu.language">Language</span>
                    </span>
                </a>
                <ul class="dropdown-menu" ngbDropdownMenu>
                    <li *ngFor="let language of languages">
                        <a class="dropdown-item" [jhiActiveMenu]="language" href="javascript:void(0);" (click)="changeLanguage(language);collapseNavbar();">{{language | findLanguageFromKey}}</a>
                    </li>
                </ul>
            </li>
            <li ngbDropdown class="nav-item dropdown pointer" placement="bottom-right" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}">
                <a class="nav-link dropdown-toggle" ngbDropdownToggle href="javascript:void(0);" id="account-menu">
                  <span *ngIf="!getImageUrl()">
                    <fa-icon [icon]="'user'"></fa-icon>
                    <span jhiTranslate="global.menu.account.main">
                      Account
                    </span>
                  </span>
                  <span *ngIf="getImageUrl()">
                      <img [src]="getImageUrl()" class="profile-image img-circle" alt="Avatar">
                  </span>
                </a>
                <ul class="dropdown-menu" ngbDropdownMenu>
                    <li *ngSwitchCase="true">
                        <a class="dropdown-item" routerLink="settings" routerLinkActive="active" (click)="collapseNavbar()">
                            <fa-icon [icon]="'wrench'" [fixedWidth]="true"></fa-icon>
                            <span jhiTranslate="global.menu.account.settings">Settings</span>
                        </a>
                    </li>
                    <li *ngSwitchCase="true">
                        <a class="dropdown-item" routerLink="password" routerLinkActive="active" (click)="collapseNavbar()">
                            <fa-icon [icon]="'clock'" [fixedWidth]="true"></fa-icon>
                            <span jhiTranslate="global.menu.account.password">Password</span>
                        </a>
                    </li>
                    <li *ngSwitchCase="true">
                        <a class="dropdown-item" (click)="logout()" id="logout">
                            <fa-icon [icon]="'sign-out-alt'" [fixedWidth]="true"></fa-icon>
                            <span jhiTranslate="global.menu.account.logout">Sign out</span>
                        </a>
                    </li>
                    <li *ngSwitchCase="false">
                        <a class="dropdown-item" (click)="login()" id="login">
                            <fa-icon [icon]="'sign-in-alt'" [fixedWidth]="true"></fa-icon>
                            <span jhiTranslate="global.menu.account.login">Sign in</span>
                        </a>
                    </li>
                    <li *ngSwitchCase="false">
                        <a class="dropdown-item" routerLink="register" routerLinkActive="active" (click)="collapseNavbar()">
                            <fa-icon [icon]="'user-plus'" [fixedWidth]="true"></fa-icon>
                            <span jhiTranslate="global.menu.account.register">Register</span>
                        </a>
                    </li>
                </ul>
            </li>
        </ul>
    </div>
</nav>
